<template>
  <router-view v-slot="{ Component }">
    <keep-alive>
      <a-config-provider prefix-cls="custom">
        <component :is="Component"></component>
      </a-config-provider>
    </keep-alive>
  </router-view>
</template>

<script setup lang="ts">
import { themeStore } from "./store/theme";
import { ConfigProvider } from 'ant-design-vue';
import { initTheme } from "@/theme";

// 修改主题
const store = themeStore();

const initThemeConfig = (color: string) => {
  ConfigProvider.config({
    prefixCls: 'custom',
    theme: {
      // 成功相关主题颜色
      primaryColor: color,
      errorColor: "#FF4D4F",
      warningColor: "#FAAD14",
      successColor: "#52C41A",
      infoColor: "#57595C",
    },
  });
}

initThemeConfig(store.getPrimary);

store.$subscribe((mutations, state) => {
  initThemeConfig(state.primaryColor);
  initTheme(state.themeType, state.primaryColor)
})

// 初始化自定义主题
initTheme(store.getThemeType, store.getPrimary);

</script>

<style></style>
